User blog:CodeHK/Editing Strategies and Tools
Contributing to the Wiki requires at least two things: Information to add or edit, and the skill to actually work with a Wiki. At bare minimum, people can get away with typing text into a page to get their point across. Putting some effort into your contributions may aid readers in understanding what you are trying to say. I will list my strategies and personal rules for making good contributions. Text Here's some general tips. *Quote sources. We take a lot of information from the Japanese Wiki, so it should be noted what is theirs and what is original content. *Keep sentences short. It's a lot easier to understand short things when there's less stuff to comprehend all at once. *Use words for single-digit numbers (one through nine). This helps avoid numerical typos and can also by easier to read in some extreme cases (eg. 1 versus I). *Although contrary to the previous point, redundancy helps readers verify their understandings of what you are trying to convey. *Use consistent naming. For example, readers are not expected to know that Awakening and Evolution are the same. *If you worry that the reader won't understand with just text, add examples and/or pictures. See Pictures. *Inter-link topics the first time it is brought up in a page. Readers won't know if something has a dedicated page for it unless it is linked. *Use lists to separate short, related data. *Use tables for tabular content. That means you should be able to categorize each table column clearly. Here are some Wiki/Web-specific tips. *Use headers to declare large sections of text. This allows people to link to specific subsections. A subsection is linked by appending "#SectionName" to a page's URL. (The section name is automatically turned into an id in the the HTML). *If a page has enough sections, a Table of Contents is automatically made for the page. *A table can be used enforce the layout of content (aka a layout table). If you use a layout table, do not style it like a table because it will fool users into expecting organized content. *If you are struggling to make the layout look like how you're imagining it, you might be over-thinking it. Let the Wiki defaults handle your layout needs. *We don't need to be concerned with mobile users too much because FKG is a Flash game. *You don't need a header at the top of a Page; readers expect an overview of the full page to be written there. *You can give a Page a cover image by putting an image as the first thing in the Page's source code. This makes the Page easier to discern when using certain Wikia Special Pages. Screenshots In-game screenshots portray information in ways text can't. Getting good, clean screenshots without including parts of the browser window is a time consuming process. This section describes some fast methods to make good screenshots. Screenshots Without Installing Programs You can get a screenshot of the game without installing anything. #Screenshot the browser using Alt+Print Screen. This button is always at the top-left of the keyboard and may be labeled something different such as PrtSc. For laptops, a Fn / Function key may need to be held down. #Open the Operating System's built-in image editor. For Windows, this is called Paint. #Paste the screenshot using Ctrl+V. #Use the image editor to crop out what you want. #Save the cleaned up image. Screenshots With Puush Puush lets you save screenshots to the web so that they can be shared to other people. After installing Puush, using Ctrl+Shift+4 lets you highlight a section of your screen. You can save the screenshot to your hard drive so that it can be inserted into the Wiki. The upside to Puush is that it requires the least amount of work and know-how to get any part of the game screenshotted. The downside to Puush is that non-paid users have their images stored in low quality and the images are only available for a few months. The quality is still acceptable for most purposes. Screenshots with XnView XnView is an image viewer with some editing features packaged with it. #Screenshot the browser using Alt+Print Screen. #Open XnView. #Press Ctrl+Shift+V or go to Edit -> Import Clipboard to get the screenshot. #Press Ctrl+S or go to File -> Save to save the file. #*Editing the image with tools such as the cropper can be done before or after saving the image. Batch Processing With XnView XnView is an image viewer, but it has an important feature called Batch Processing which lets you mass edit pictures. This is helpful if you take tons of screenshots of the browser and want to crop out the browser window from all of the pictures at once. #Screenshot the browser using Alt+Print Screen. #Open XnView. #Open the Batch Processing window from the Tools menu or by pressing Ctrl+U. #Add all files you want to batch process in the General tab. #In the Transformations tab, add the Crop and Auto crop operations to the list of things to do. #*Crop needs to know where to start the cropping from (x, y) and how big to crop (width, height). Grab as much white area around the game screen as you can, but don't include the Tip text at the bottom of the page. The numbers required will vary based on which browser you use and its appearance settings. #*Auto crop needs to be set to have a Tolerance of 0. The Background colour must be set to pure white. #*If you know these settings work, save the actions as a script so that you can just load the script later and repeat the process on future images. #After running the batch processing operations, new JPGs will be put into the same directory where the input files were (unless you specified an output directory). Upload these to the Wiki on the page they are used in, or use the . In order to ensure the XnView script always works, you can use something like Sizer. to keep your browser at a specific size. Pictures *JPG format is the usual format you will use because the file size is small, so the page will load faster. The format handles images with countless colors well. *PNG format is best for pictures with discernable colors such as those with flat colored backgrounds or those without gradients. They can have a smaller file size than JPG and even look nicer. Usually, PNG works best for self-made pictures. *When uploading a PNG, consider running it through PNGOUT first in order to minimize its filesize. *Black-outlined, white text is readable anywhere. Gimp can create outlined text in a painful number of steps, but BeFunky can make it with no extra steps required. Both of these image editors are free. *When using color to add emphasis, be aware that not all color-blind users will not pick up on differently-colored parts of images you highlight. Types of color-blindness vary, so rather than trying different colors, emphasize using contrast. The tip regarding outlined text capitalizes on this. *When translating an image, choose whether to translate the text on-the-spot or just list out the things to translate. ** If the picture's content won't change over time, translating the image contents is convenient for the reader because the translations replace or are placed next to their respective content. Example: Synthesis Chart. ** If the picture's content may be shuffled in the future such as with a game GUI element, numbering the picture's contents and listing the translations in plain text is effective. This lets you easily add list elements if the GUI gets more content. Example: Shop Layout. *Know when to float images. Images with the thumb property will be floated. ** Float images if you want users to click on them to see them at full size. Example: Showing what Whale Cannon is; the image itself has nothing else of value to scrutinize. **Do not float images if you want to show the image content clearly at all times. Example: The previously shown Shop Layout image presuming there's a list nearby to explain the meaning of the numbers. *If you float something and it overlaps something below it, use to force the things to be separated. View this blog post's source code as an example. Naming Conventions Scenariobanner 2.jpg|Event banner: scenariobanner_2.jpg Banner event 0052.jpg|Event ad: Banner_event_0052.jpg banner_event_rep_0039.jpg|Reprint event ad: Banner_event_rep_0039.jpg Banner event rep2 0002.jpg|Re-reprint event ad: Banner_event_rep2_0002.jpg Ev52-guest.jpg|Guest party: Ev52-guest.jpg Ev52-e1.jpg|Event stage: Ev52-e1.jpg ev39-e5-rep.jpg|Reprint event stage: Ev39-e5-rep.jpg Ev8-e1-rerep.jpg|Re-reprint stage: Ev8-e1-rerep.jpg Some pictures and code have naming conventions so that coming up with names and searching for existing images is easier. Hash marks ( # ) denote numbers. Multiple hash marks mean the number is zero-padded to become the same length as the number of hashes. *Event banners are Scenariobanner_#.jpg; it's the in-game naming convention. *Event advertisements are Banner_event_####.jpg; it's the in-game naming convention. *Reprint event ads are Banner_event_rep_####.jpg; it's the in-game naming convention. *Re-reprint event ads are Banner_event_rep2_####.jpg; it's the in-game naming convention. *Guest parties are Ev#-guest.jpg where Ev# refers to the event number. *Event stages are Ev#-e#.jpg where e# is stage 1-8. *Reprint stages are Ev#-e#-rep.jpg where rep is short for "reprint". *Re-reprint stages are Ev#-e#-rerep.jpg where rerep is short for "re-reprint". Working With Wikia *Fill in Edit Summaries (aka Commit Messages) so that people can have an overview of how a page evolved when looking at its history. This is useful for when people need to look up old versions of the page and/or revert to old versions. Editors There are two types of editors. Access them at the upper-left of a page with the button labeled "Edit". Category:Blog posts Category:Guide